import { createSlice, createAsyncThunk, type PayloadAction } from "@reduxjs/toolkit";
import * as API from "../api/http";
import type { shopTS, typeTS } from "./crmsTS";

//数据类型
type initialStateTS = {
    shoplist: Array<shopTS>,
    typelist: Array<typeTS>,
    activekey: string | number
}

//存放数据的容器
let initialState: initialStateTS = {
    shoplist: [],//商品列表数据
    typelist: [],//分类列表数据
    activekey: '1'
}

//创建slice切片
const todosSlice = createSlice({
    name: "todos",
    initialState,
    reducers: { //同步方法
        //获取商品列表数据
        t_getShoplist(state: initialStateTS, action: PayloadAction<Array<shopTS>>) {
            state.shoplist = action.payload
        },
        //获取分类列表数据
        t_getTypelist(state: initialStateTS, action: PayloadAction<Array<typeTS>>) {
            state.typelist = action.payload
        },
        //添加商品列表数据
        t_addShoplist(state: initialStateTS, action: PayloadAction<shopTS>) {
            state.shoplist.push(action.payload)
        },
        //编辑商品列表
        t_editShoplist(state: initialStateTS, action: PayloadAction<shopTS>) {
            let i = state.shoplist.findIndex(item => {
                return item.id == action.payload.id
            })
            state.shoplist[i] = action.payload
        },
        //删除商品列表数据
        t_delShoplist(state: initialStateTS, action: PayloadAction<number>) {
            state.shoplist = state.shoplist.filter(item => {
                return item.id !== action.payload
            })
        }



    },
});

export const actionfn = todosSlice.actions;
export default todosSlice.reducer;

//异步操作 获取商品列表数据
export let async_shoplist = createAsyncThunk('async_shoplist',
    async (_, store) => {
        //调取接口
        let res = await API.http_getShoplist()
        //同步修改异步
        store.dispatch(actionfn.t_getShoplist(res))
    })

//异步操作 获取分类列表数据
export let async_typelist = createAsyncThunk('async_typelist',
    async (_, store) => {
        //调取接口
        let res = await API.http_getTypelist()
        //同步修改异步
        store.dispatch(actionfn.t_getTypelist(res))
    })

//异步操作 添加商品列表数据
export let async_addShoplist = createAsyncThunk('async_addShoplist',
    async (obj: shopTS, store) => {
        //调取接口
        let res = await API.http_addShoplist(obj)
        //同步修改异步
        store.dispatch(actionfn.t_addShoplist(res))
    })

//异步操作 编辑商品列表数据
export let async_editShoplist = createAsyncThunk('async_editShoplist',
    async (obj: shopTS, store) => {
        //调取接口
        let res = await API.http_editShoplist(obj)
        //同步修改异步
        store.dispatch(actionfn.t_editShoplist(res))
    })

//异步操作 删除商品列表数据
export let async_delShoplist = createAsyncThunk('async_delShoplist',
    async (id: number, store) => {
        //调取接口
        await API.http_delShoplist(id)
        //同步修改异步
        store.dispatch(actionfn.t_delShoplist(id))
    })
//搜索商品列表数据
export let async_searchShoplist = createAsyncThunk('async_searchShoplist',
    async (title: string, store) => {
        let res = await API.http_searchShoplist(title)
        store.dispatch(actionfn.t_getShoplist(res))
    })


